<template>
  <div class="app-container">
    <el-form ref="form" :model="form" label-width="120px">
      <el-form-item label="基本信息" color="red">
      </el-form-item>
      <el-form-item label="姓名">
        <el-col :span="4">
          <el-input v-model="form.val[0]" />
        </el-col>
        <el-col :span="2" class="line">年龄</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[2]" />
        </el-col>
        <el-col :span="2" class="line">手机号</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[3]" />
        </el-col>
      </el-form-item>
      <el-form-item label="性别">
        <el-select v-model="form.val[1]">
          <el-option label="男" value="male" />
          <el-option label="女" value="female" />
        </el-select>
      </el-form-item>
      <el-form-item label="饮食习惯">
        <el-col :span="4">
          <el-input v-model="form.val[4]" />
        </el-col>
        <el-col :span="2" class="line">睡眠习惯</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[5]" />
        </el-col>
        <el-col :span="2" class="line">性格特点</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[6]" />
        </el-col>
      </el-form-item>
      <el-form-item label="血项化验">
      </el-form-item>
      <el-form-item label="血常规">
        <el-col :span="4">
          <el-input v-model="form.val[7]" />
        </el-col>
        <el-col :span="2" class="line">肝功能</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[8]" />
        </el-col>
        <el-col :span="2" class="line">肾功能</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[9]" />
        </el-col>
      </el-form-item>
      <el-form-item label="血脂">
        <el-col :span="4">
          <el-input v-model="form.val[10]" />
        </el-col>
        <el-col :span="2" class="line">超声波检查</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[11]" />
        </el-col>
        <el-col :span="2" class="line">甲状腺</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[12]" />
        </el-col>
      </el-form-item>
      <el-form-item label="胸部">
        <el-col :span="4">
          <el-input v-model="form.val[13]" />
        </el-col>
        <el-col :span="2" class="line">肝胆脾胰</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[14]" />
        </el-col>
        <el-col :span="2" class="line">肾与输尿管</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[15]" />
        </el-col>
      </el-form-item>
      <el-form-item label="妇科">
        <el-col :span="4">
          <el-input v-model="form.val[16]" />
        </el-col>
      </el-form-item>
      <el-form-item label="CT检查">
      </el-form-item>
      <el-form-item label="肺部CT">
        <el-col :span="4">
          <el-input v-model="form.val[17]" />
        </el-col>
      </el-form-item>
      <el-form-item label="肠镜检查">
      </el-form-item>
      <el-form-item label="胃镜">
        <el-col :span="4">
          <el-input v-model="form.val[18]" />
        </el-col>
        <el-col :span="2" class="line">肠镜</el-col>
        <el-col :span="4">
          <el-input v-model="form.val[19]" />
        </el-col>
      </el-form-item>
      <el-form-item label="诊断结果">
      </el-form-item>
      <el-form-item label="饮食">
        <el-col :span="11">
          <el-input v-model="form.val[20]" />
        </el-col>
      </el-form-item>
      <el-form-item label="药物">
        <el-col :span="11">
          <el-input v-model="form.val[21]" />
        </el-col>
      </el-form-item>
      <el-form-item label="运动">
        <el-col :span="11">
          <el-input v-model="form.val[22]" />
        </el-col>
      </el-form-item>
      <el-form-item label="随访">
        <el-col :span="11">
          <el-input v-model="form.val[23]" />
        </el-col>
      </el-form-item>
      <el-form-item label="随访类型">
        <el-select v-model="form.val[24]">
          <el-option label="大体检" value="male" />
          <el-option label="小提醒" value="female" />
        </el-select>
      </el-form-item>
      <el-form-item label="下次随访日期">
        <el-col :span="5">
          <el-date-picker v-model="form.date1" type="date" placeholder="请选择日期" style="width: 100%;" />
        </el-col>
        <el-col :span="2" class="line">-</el-col>
        <el-col :span="4">
          <el-time-picker v-model="form.date2" type="fixed-time" placeholder="请选择时间" style="width: 100%;" />
        </el-col>
      </el-form-item>
      <!--
      <el-form-item label="Instant delivery">
        <el-switch v-model="form.delivery" />
      </el-form-item>
      <el-form-item label="Activity type">
        <el-checkbox-group v-model="form.type">
          <el-checkbox label="Online activities" name="type" />
          <el-checkbox label="Promotion activities" name="type" />
          <el-checkbox label="Offline activities" name="type" />
          <el-checkbox label="Simple brand exposure" name="type" />
        </el-checkbox-group>
      </el-form-item>
      <el-form-item label="Resources">
        <el-radio-group v-model="form.resource">
          <el-radio label="Sponsor" />
          <el-radio label="Venue" />
        </el-radio-group>
      </el-form-item>
      <el-form-item label="Activity form">
        <el-input v-model="form.desc" type="textarea" />
      </el-form-item>
      -->
      <el-form-item>
        <el-button type="primary" @click="onSubmit">创建</el-button>
        <el-button @click="onCancel">关闭</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
export default {
  data() {
    return {
      form: {
        val: [],
        name: '',
        region: '',
        date1: '',
        date2: '',
        delivery: false,
        type: [],
        resource: '',
        desc: '',
        openid: this.$route.query.openid
      }
    }
  },
  mounted() {
    this.form.openid = this.$route.query.openid
  },
  methods: {
    onSubmit() {
      console.log(this.form.openid)
      this.$message('创建成功')
      this.$router.push({ path: '/' })
    },
    onCancel() {
      this.$router.push({ path: '/' })
    }
  }
}
</script>

<style scoped>
.line{
  text-align: center;
}
</style>

